<template>
  <div class="baseprivilege">
   <div>
        <el-carousel :interval="2000" type="card" height="400px" >
          <el-carousel-item>
            <img src="./01.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item>
            <img src="./02.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item>
            <img src="./03.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item>
            <img src="./02.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item>
            <img src="./01.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item>
            <img src="./03.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item v-for="item in 0" :key="item">
          <h3 class="medium">{{ item }}</h3>
          </el-carousel-item>
        </el-carousel>
    </div>
    <!-- 按钮 -->
    <!-- {{basePrivileges}} -->
    <div class="btns">
      <el-form size="small" inline style="text-align: center">
        <el-form-item >
          <el-input v-model="param.name" placeholder="请输入名称"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" plain  icon="el-icon-search" @click="loadBasePrivileges">搜索</el-button>
        </el-form-item>
      </el-form>
      <el-form style="text-align:right">
        <el-form-item>
          <el-button type="primary" size="small" icon="el-icon-right" @click="toAddHandler">新增</el-button>
          <el-button type="primary" size="small" icon="el-icon-right" @click="downloadHandler">导出</el-button>
        </el-form-item>
      </el-form>
    
      
    </div>
    <!-- {{basePrivileges}} -->
    <!-- /按钮 -->
    <!--表格  -->
    <el-table size="small"  v-loading="loading" :data="basePrivileges">
      <el-table-column type="index" :index="1" label="序号"></el-table-column>
      <el-table-column
        label="名字"
        prop="name"
       
      ></el-table-column>
      <el-table-column
        label="描述"
        prop="description"
      
      ></el-table-column>
      <el-table-column
        label="route"
        prop="route"
       
      ></el-table-column>
      <el-table-column
        label="路线名"
        prop="route_name"
       
      ></el-table-column>
      <el-table-column
        label="类型"
        prop="type"
       
      ></el-table-column>
      <el-table-column
        label="图标"
        prop="icon"
      
      ></el-table-column>
        <el-table-column
        label="hidden"
        prop="hidden"
        
      ></el-table-column>
       <el-table-column
        label="总数"
        prop="num"
      
      ></el-table-column>
       <el-table-column
        label="parentId"
        prop="parentId"
       
      ></el-table-column>
      <el-table-column label="操作" width="100" align="center">
        <!-- /定制插槽 -->
        <template slot-scope="scope">
          <el-button type="text" size="mini" icon="el-icon-right" @click="editHandler(scope.row)">修改</el-button >
          <el-button type="text" size="mini" icon="el-icon-delete" @click="deleteHandler(scope.row)">删除</el-button >

        </template>
      </el-table-column>
    </el-table>
    <!-- /表格 -->
   
  </div>
</template>

<script>
import { get, post, del } from "@/utils/request";
export default {
  data() {
    return {
      //参数，用于保存检索的参数
      param: {},
      
      //组件模板中需要的数据
      basePrivileges: [],
    };
  },
  created() {
    this.loadBasePrivileges();
  },
  methods: {
    //修改事件处理函数
    editHandler(row){
     //跳转到修改界面（与新增页面共用）
     //携带当前行的数据
     this.$router.push({
         path:"/BaseRole/BasePrivilege_create",        //跳转的路由（前端）
         query:row,      //携带参数
     });
    },
    //删除事件处理函数
    deleteHandler(row) {
      this.$confirm("此操作将永久删除该数据，是否继续？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        let url = "http://121.196.106.124:8888/BasePrivilege/deleteById";
        del(url, { id: row.id }).then((resp) => {
          this.$message({ type: "success", message: resp.message });
          this.loadBasePrivileges();
        });
      });

      // alter(row.id);
    },
    //跳转
    toAddHandler() {
      this.$router.push("/BaseRole/BasePrivilege_create");
    },

    //导出函数
    downloadHandler(){
      window.location.href="121.196.106.124:8888/BasePrivilege/download?name"+this.param.name
    },
    loadBasePrivileges() {
      let url = "http://121.196.106.124:8888/BasePrivilege/query";
      get(url, this.param).then((resp) => {
        this.basePrivileges = resp.data;
      });
    },
  },
};
</script>


<style scoped>

  img{
    width:100%;
    height:inherit;
  }
 body {
    margin: 0;
  }
</style>